import {Modal, Button,Icon,Row,Col} from 'antd';
import * as API_LIST from '../apis/fnaSpecial'
import {WeaTableNew} from 'comsMobx';
const WeaTable = WeaTableNew.WeaTable;
const {TableStore} = WeaTableNew

export default class PopupListButton extends React.Component{

	constructor(props) {
		super(props);
		this.state = { visible: false,tableStore:new TableStore() };
    }

    componentDidMount(){
    	//先空表单，然后查列表数据，再渲染
    	//const {workflowid, detailRecordId, requestid, actions} = this.props;
    	//console.log(actions);
       
        const {detailRecordId,requestid} = this.props;
   
        API_LIST.amountLogData({'detailRecordId':detailRecordId,'requestid':requestid}).then(data =>{
            let tableStoreTemp = new TableStore();
            tableStoreTemp.getDatas(data.datas,1);
            //console.log('tableStoreTemp',tableStoreTemp);
            this.setState({
              tableStore:tableStoreTemp
            });
        });


    }

    showModal = () => {
	    this.setState({
	    	visible: true
	    });
	}
    

    handleCancel = (e) => {
    	this.setState({
      		visible: false,
    	});
  	}
    

    render(){
        //console.log(this.state);
    	const {tableStore} = this.state;

    	return(
            <div>
    		   	<Button ecId={`${this && this.props && this.props.ecId || ''}_Button@82makc`} onClick={this.showModal}>查看金额修改历史</Button>
    	        <Modal ecId={`${this && this.props && this.props.ecId || ''}_Modal@ibj5bj`} ref="modal"
    	          title="日志"
    	          visible={this.state.visible}
                  maskClosable={false}
                  width="626px"
                  onCancel={this.handleCancel}
                  footer={[
                    <Button ecId={`${this && this.props && this.props.ecId || ''}_Button@31xnjj@Cancel`} key="back" type="ghost" size="large" onClick={this.handleCancel} >取 消</Button>,
                  ]}
    	        >

                 <Row ecId={`${this && this.props && this.props.ecId || ''}_Row@wmmz4s`} className="wea-title" style={{borderBottom:'1px solid #e9e9e9',height:'44px'}} type="flex" justify="space-around" align="middle">
                    <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@syaa89`} span="16" >
                        <div className="icon-circle-base " style={{background:"#f14a2d"}}>
                            <i className='icon-coms-Finance' /> 
                        </div>
                        <span >调整明细</span>
                    </Col>
                    <Col ecId={`${this && this.props && this.props.ecId || ''}_Col@v6rvlh`} span="8" style={{textAlign:'right'}}>
                        {/*下拉选项*/}
                    </Col>
                 </Row>
    		        <WeaTable ecId={`${this && this.props && this.props.ecId || ''}_WeaTable@g5p0y4`} 
                        hasOrder={true}
                        needScroll={true}
                        comsWeaTableStore={tableStore}
                    />
                    
    	        </Modal>
		    </div>
    	);

    }
    
   

}



